@tailwind base;
@tailwind components;
@tailwind utilities;

:root {
  --background: #ffffff;
  --foreground: #171717;
}

@media (prefers-color-scheme: dark) {
  :root {
    --background: #0a0a0a;
    --foreground: #ededed;
  }
}

body {
  color: var(--foreground);
  background: var(--background);
  font-family: Arial, Helvetica, sans-serif;
}

@layer utilities {
  .text-balance {
    text-wrap: balance;
  }
}

/* styles/globals.css */
.mdx-content h1 {
  color: #333;
  font-size: 2.5rem;
}

.mdx-content p {
  color: #666;
  font-size: 1.1rem;
}

.mdx-content li {
  color: #666;
  font-size: 1.1rem;
}

/* .mdx-content ol {
  margin: 0px;
} */

.mdx-content a {
  color: #0070f3;
  text-decoration: none;
}

.mdx-content a:hover {
  text-decoration: underline;
}

pre{
  margin: 2px;
  border-color: #ddd;
  background-color: #2d2d2d;
  color: #ccc;
  max-height: 300px; /* 设置最大高度 */
  overflow-y: auto;  /* 在内容超出时显示垂直滚动条 */
  border: 1px solid #ccc; /* 可选的边框，用于可视化元素边界 */
  padding: 10px;      /* 可选的内边距 */

}